<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>

<style>
body {
  font-size: 16px;
}
</style>

<div id="div0" style="background-color: red"></div>
<div id="div1" style="background-color: red"></div>
<div id="div2" style="background-color: red"></div>
<div id="div3"></div>
<svg id="svg0" style="background-color: red"></svg> 

<script>
div0.style = '';
div1.style = 'color:green';
div2.style = 'color:green; font-size:30px';
div3.style = 'color:green';

document.styleSheets[0].cssRules[0].style = 'font-size:30px';

svg0.style = '';

test(function() {
  assert_equals(div0.style.backgroundColor, "");

  assert_equals(div1.style.backgroundColor, "");
  assert_equals(div1.style.color, "green");

  assert_equals(div2.style.backgroundColor, "");
  assert_equals(div2.style.color, "green");
  assert_equals(div2.style.fontSize, "30px");

  assert_equals(div3.style.color, "green");

}, 'Assigning to HTMLElement.style updates the style declaration');

test(function() {
  assert_equals(svg0.style.backgroundColor, "");
}, 'Assigning to SVGElement.style updates the style declaration');

test(function() {
  assert_equals(document.styleSheets[0].cssRules[0].style.cssText, "font-size: 30px;");
}, 'Assigning to CSSStyleRule.style updates the style declaration');

</script>